<template>
  <div class="operators" :class="{'isPc':fun.isPc()}">
    <c-title :hide="false" :text="'运营商'"></c-title>
    <van-tabs v-model="active">
      <van-tab title="律所" name="lawfirmPlatform"></van-tab>
      <van-tab title="律师" name="lawyerPlatform"></van-tab>
      <van-tab title="企业" name="enterprise"></van-tab>
    </van-tabs>
    <keep-alive>
      <components :is="active"></components>
    </keep-alive>
    <div class="btn">
      <van-button color="#daa032" @click.stop  v-clipboard:copy="type_link" v-clipboard:success="onCopy">邀请{{ type_nickName }}</van-button>
    </div>
  </div>
</template>

<script>
import {Toast} from "vant";
import lawfirmPlatform from "./components/lawfirm-platform";
export default {
  data() {
    return {
      active: "lawfirmPlatform",
    };
  },
  computed: {
    type_nickName() {
      return this.active == "lawfirmPlatform" ? "律所" : this.active == "lawyerPlatform" ? "律师" : "企业";
    },
    type_link(){
      let current_path = window.location.href,id=localStorage.getItem("uid")
      if(this.active == "lawfirmPlatform" ){
         current_path =  current_path.replace('lawyer_platform/operators','applyFor?apply_for=lawOffice&share=lawOffice&merchant_member_id='+id);
      }else if(this.active == "lawyerPlatform" ){
         current_path =  current_path.replace('lawyer_platform/operators','applyFor?apply_for=lawYerManagement&share=lawYerManagement&merchant_member_id='+id);
      }else{
        current_path =  current_path.replace('lawyer_platform/operators','lawyer_platform/enterpriseAdd?share=enterprise&merchant_member_id='+id);
      }
       current_path= current_path.replace("?i","&i")
      return current_path
    }
  },
  methods:{
     // 复制链接
    onCopy() {
      Toast({
        message: "复制成功",
        position: "bottom",
        duration: 5000
      });
    },
  },
  components:{
    lawfirmPlatform,
    lawyerPlatform:()=>import("./components/lawyer-platform.vue"),
    enterprise:()=>import("./components/enterprise.vue")
  }
};
</script>

<style lang="scss" scoped>
.isPc{
  max-width: 375px;
}
.name{
  font-size: 1.1428rem;
}
.btn {
  position: fixed;
  width: 100%;
  bottom: 0;
  background-color: #ffffff;
  box-shadow: 0px -2px 7px 0px rgba(213, 213, 213, 0.59);
  padding: 0.5714rem 1.7857rem;
  /deep/ .van-button--normal {
    width: 100%;
    border-radius: 0.3571rem;
  }
}
.mr-1 {
  margin-right: 1rem;
}
.life {
  margin-right: 0.325rem;
  color: #6b6b6b;
}
.domain-nickName {
  width: 3.5714rem;
  border: 1px solid #f5b435;
  border-radius: 2px;
  text-align: center;
  color: #f5b435;
  font-size: 0.7142rem;
  margin-right: 0.242rem;
  box-sizing: border-box;
  margin-bottom: 1rem;
}
.flex {
  display: flex;
}
.between {
  justify-content: space-between;
}
/deep/ .van-tabs__line {
  background-color: #daa032;
}
/deep/ .van-tab--active {
  color: #daa032 !important;
}
.operators {
  position: relative;
  background-color: #fff;
  height: 100%;
  padding-bottom: 5rem;
}
.info {
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.c-6b6b6b {
  color: #6b6b6b;
}
.contact-way {
  color: #6b6b6b;
  font-size: 0.8rem;
}
.lawyer-title {
  color: #daa032;
  font-size: 0.857rem;
}
div.item,
.lawyer {
  display: flex;
  margin-left: 0.714rem;
  margin-top: 1.3571rem;
}
.lawyer {
  margin-left: 0.714rem;
}
img {
  margin: 0;
  width: 3rem;
  height: 3rem;
  border-radius: 100px;
  object-fit: cover;
  border: 1px solid #fff;
  margin-right: 0.328rem;
}
.lawyer-detail {
  margin-top: 0.857rem;
  display: flex;
  flex-wrap: wrap;
}
</style>
